The opacity property in CSS is used to set the transparency level of an element. The value of opacity ranges from 0 (completely transparent) to 1 (completely opaque).

Basic Usage

Here' how you can use the opacity property:

.element {
    opacity: 0.5; /* 50% transparent */
}

Example

Below are a few examples of different opacity values:

/* Completely opaque (default) */
.opaque {
    opacity: 1;
}

/* 75% opacity */
.seventy-five {
    opacity: 0.75;
}

/* 50% opacity */
.fifty {
    opacity: 0.5;
}

/* 25% opacity */
.twenty-five {
    opacity: 0.25;
}

/* Completely transparent */
.transparent {
    opacity: 0;
}

Using the opacity property, you can create various transparency effects, which can be useful for overlays, hover effects, and more. Let me know if you need more details or examples!